<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		*{
			padding: 0;
			margin: 0;
		}
		body{
			padding-top: 80px;
		}
		.header{
			width: 100%;
			height: 80px;
			background-color: red;
			/*脱离了标准文档流*/

			/*参考点：是以浏览器的左上角*/
			position: fixed;
			top:0;
			left: 0;
			z-index: 10000;

		}
		.active{
			position: relative;

		}
	</style>
</head>
<body>

	<div class="header"></div>

	<p>alex1</p>
	<p>alex2</p>
	<p>alex3</p>
	<p>alex4</p>
	<p>alex5</p>
	<p>alex6</p>
	<p>alex7</p>
	<p>alex8</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p class="active">alex6666</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>
	<p>alex</p>

	
</body>
</html>